<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div></div>
    <h3>1、promise快速入门</h3>
    <h3>2、基于promise的Ajax请求</h3>
    <script>
        const div = document.querySelector('div');
        // promise快速入门
        function test1() {
            div.innerHTML = '请求中。。。';
            const p = new Promise((resolve, reject) => {
                setTimeout(() => {
                    let flag = true;
                    if (flag) {
                        resolve('hello');
                    } else {
                        reject('failed');
                    }
                }, 1000);
            });

            /* p.then(data => {
                div.innerHTML = data;
                console.log("resolve", data);
            }, info => {
                div.innerHTML = info;
                console.log("reject", info);
            }).finally(() => {
                console.log("finish");
            }); */

            p.then(data => {
                div.innerHTML = data;
                console.log("resolve", data);
            }).catch(info => {
                div.innerHTML = info;
                console.log("reject", info);
            }).finally(() => {
                console.log("finish");
            });
        }

        // 基于promise的Ajax请求
        function test2() {
            // 懒得写了，没什么卵用
        }

        test1();
        test2();
    </script>
</body>

</html>